﻿@model FO.Models.Articles
@{
    ViewBag.Title = "Cập nhật - " + Model.Title + "";
    Layout = "~/Views/Shared/_CpanelLayout.cshtml";
}
<link rel="stylesheet" href="@Url.Content("~/Content/Cpanel/treeview/jquery.treeview.css")" />
<link href="@Url.Content("~/Content/Cpanel/contextmenu/jquery.contextMenu.css")" rel="stylesheet" type="text/css" />

<script src="@Url.Content("~/Content/Cpanel/treeview/jquery.treeview.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Content/Cpanel/contextmenu/jquery.ui.position.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Content/Cpanel/contextmenu/jquery.contextMenu.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Content/js/jquery.fancybox.js")" type="text/javascript"></script>
<script type="text/javascript" src="@Url.Content("~/Content/tinymce/tinymce.min.js")"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $(".active").removeClass("active");
        $("li[rel=rel-article]").parent().parent().css("display", "block");
        $("li[rel=rel-article]").parent().parent().prev().addClass("active");
        $("li[rel=rel-article]").addClass("active");
        $("li[rel=rel-article-all]").addClass("active");
        $(".fancybox-close").click(function () {
            $("#fancy").fadeOut();
        });
        $("#browers-img").click(function () {
            $("#fancy").fadeIn();
            $("#currenttiny").html("browers");
            return false;
        });
    });
</script>
<script type="text/javascript">
    tinymce.init({
        mode: "exact",
        elements: "description",
        height: "300",
        plugins: [
                "advlist autolink autosave link image lists charmap print preview hr anchor pagebreak spellchecker",
                "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",
                "table contextmenu directionality emoticons template textcolor paste fullpage textcolor"
        ],

        toolbar1: "newdocument fullpage | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | styleselect formatselect fontselect fontsizeselect",
        toolbar2: "cut copy paste | searchreplace | bullist numlist | outdent indent blockquote | undo redo | link unlink anchor insertimg media code | inserttime preview | forecolor backcolor",
        toolbar3: "table | hr removeformat | subscript superscript | charmap emoticons | print fullscreen | ltr rtl | spellchecker | visualchars visualblocks nonbreaking template pagebreak restoredraft"
        , setup: function (ed) {
            // Add a custom button
            ed.addButton('insertimg', {
                title: 'Insert Images',
                image: '/content/images/insert-img.png',
                onclick: function () {
                    // Add you own code to execute something on click
                    $("#fancy").fadeIn();
                    $("#currenttiny").html("description");
                    ed.focus();
                    //ed.selection.setContent('Hello world!');
                }
            });
        },
        style_formats: [
              { title: 'Bold text', inline: 'b' },
              { title: 'Red text', inline: 'span', styles: { color: '#ff0000' } },
              { title: 'Red header', block: 'h1', styles: { color: '#ff0000' } },
              { title: 'Example 1', inline: 'span', classes: 'example1' },
              { title: 'Example 2', inline: 'span', classes: 'example2' },
              { title: 'Table styles' },
              { title: 'Table row 1', selector: 'tr', classes: 'tablerow1' }
        ],
        relative_urls: false,
        remove_script_host: false,
        convert_urls: true,
    });
</script>
<script type="text/javascript">
    jQuery.fn.center = function () {
        this.css("position", "absolute");
        this.css("top", Math.max(0, (($(window).height() - $(this).outerHeight()) / 2) +
                                                $(window).scrollTop()) + "px");
        this.css("left", Math.max(0, (($(window).width() - $(this).outerWidth()) / 2) +
                                                $(window).scrollLeft()) + "px");
        return this;
    }

    function ajaxdbSelect(sfile) {
        currentSkfile = $(sfile);
        $(".skselected").removeClass("skselected");
        if (!currentSkfile.hasClass("skselected")) {
            currentSkfile.addClass("skselected");
        }
    }
    function ajaxSelect(sfile) {
        //if ($('.mydivclass').length) {
        currentSkfile = $(sfile);
        if (currentSkfile.hasClass("skselected")) {
            currentSkfile.removeClass("skselected");
        }
        else {
            currentSkfile.addClass("skselected");
        }
    }

    function ajaxRfiles(stringpath) {
        $.getJSON("/File/ReadFiles", { folderPath: stringpath }, function (rvdata) {
            htmlcode = "";

            var currentFolder = $(".skselected-folder").attr("rel");
            $("#skFolderContent").html("<center><img src='/Content/loading.gif'></center>");
            $(rvdata).each(function () {
                htmlcode += "<div class='skfile' onclick=\"return ajaxSelect(this)\;\" rel='" + $(this).attr("Name") + "'>";
                htmlcode += "<div class='skfileicon'>";
                if ($(this).attr("isImage")) {
                    htmlcode += "<img src='" + "/" + currentFolder + "/" + $(this).attr("Name") + "'   class='skfileicon-image'/>";
                }
                else {

                }
                htmlcode += "</div>";
                htmlcode += "<div class='skfilename'><p>" + $(this).attr("Name") + "</p></div>";
                htmlcode += "</div>";
            });
            $("#skFolderContent").html(htmlcode);
        });
    }
    function ajaxRtree(mtree) {
        $(".skselected-folder").removeClass("skselected-folder");

        $(mtree).addClass("skselected-folder");
        currentFolder = $(mtree);
        var uploader = new qq.FileUploader({
            element: document.getElementById('file-uploader1'),
            multiple: false,
            allowedExtensions: ['jpg', 'jpeg', 'png', 'gif'],
            params: { FolderPath: currentFolder.attr("rel") },
            multiple: true,
            acceptFiles: "image/*",
            action: '@Url.Action("Upload", "File")',
            onComplete: function (id, fileName, responseJSON) {
                if (uploader.getInProgress() > 0) {
                    return;
                }
                else {
                    $("#refresh-listfile").click();
                }
            }
        });
        var thispath = $(mtree).attr("rel");
        ajaxRfiles(thispath);
        subul = currentFolder.next();
        parentFolder = currentFolder.parent().parent().prev();

        $.getJSON("/File/ReadFolder", { folderPath: thispath }, function (rvdata) {

            subul.addClass("closed");
            subul.html(""); htmlcode = "";
            $(rvdata).each(function () {
                if (parseInt($(this).attr("hasFiles")) > 0 ? "class=closed" : "") {
                    htmlcode += "<li class=closed><span class='folder' onclick=\"return ajaxRtree(this)\;\" rel='" + currentFolder.attr("rel") + "/" + $(this).attr("Name") + "'>";
                    htmlcode += $(this).attr("Name");
                    htmlcode += "</span><ul></ul></li>";
                } else {
                    htmlcode += "<li><span class='folder'  onclick=\"return ajaxRtree(this)\;\" rel='" + currentFolder.attr("rel") + "/" + $(this).attr("Name") + "'>";
                    htmlcode += $(this).attr("Name");
                    htmlcode += "</span></li>";
                }
            });
            subul.html(htmlcode);
        });
    }
    function ajaxReadFolder(foldername) {

        return false;
    }
    $(document).ready(function (e) {

        $(function () {
            $.contextMenu({
                selector: '.skfile',
                callback: function (key, options) {
                    var currentFileName = $(this).attr("rel");
                    var currentFolder = $(".skselected-folder").attr("rel");
                    var currentFile = $(this);
                    var currentPath = currentFolder + "/" + currentFileName;
                    if (key == "edit") {
                        $("#editFile").css("display", "block");
                        $(".edNewFileName").val(currentFileName);
                        $(".edFileName").html(currentFileName);
                    }
                    else if (key == "insert") {

                        var imagepath = $("#AppUrl").html() + "/" + currentFolder + "/" + currentFileName;
                        $("#fancy").fadeOut();
                        if ($("#currenttiny").html() == "browers") {
                            $("#Image").val(currentFileName);
                        }
                        else {
                            tinymce.get($("#currenttiny").html()).selection.setContent("<img src='" + imagepath + "'/>");
                        }

                    }
                    else if (key == 'delete') {
                        //do some thing to delete file.
                        filecount = $(".skselected").length;
                        var msgtext = "tập tin " + currentFileName;

                        if (filecount > 0) {
                            msgtext = filecount + " tập tin đã chọn";
                            if (confirm("Bạn có muốn xóa " + msgtext + " ?")) {
                                $(".skselected").each(function () {
                                    var currentFileSeleted = $(this);
                                    currentFileSeletedFilename = currentFileSeleted.attr("rel");
                                    pathtodelete = currentFolder + "/" + currentFileSeletedFilename;
                                    $.getJSON("/File/ajaxDeleteFile", { spath: pathtodelete }, function (rvdata) {
                                        if (rvdata.status == true) {
                                            currentFileSeleted.remove();
                                        }
                                        else {
                                            alert(rvdata.msg);
                                        }
                                    });
                                });
                            }
                        }
                        else {
                            if (confirm("Bạn có muốn xóa " + msgtext + " ?")) {
                                //do something to deletefile..

                                pathtodelete = currentFolder + "/" + currentFileName;
                                //ajaxDeleteFile
                                $.getJSON("/File/ajaxDeleteFile", { spath: pathtodelete }, function (rvdata) {
                                    if (rvdata.status == true) {
                                        currentFile.remove();
                                    }
                                    else {
                                        alert(rvdata.msg);
                                    }
                                });
                            }
                        }
                    }
                },
                items: {
                    "edit": { name: "Rename", icon: "edit", accesskey: "e" },
                    "insert": { name: "Insert", icon: "add" },
                    "delete": { name: "Delete", icon: "delete" },
                    "sep1": "---------",
                    "quit": { name: "Quit", icon: "quit" }
                }
            });
        });
        $("#editFile").center();
        $("#browser").treeview();
        $("#edSave").click(function () {
            var currentFolder = $(".skselected-folder").attr("rel");
            var path = $(".edFileName").html();
            var newfile = $(".edNewFileName").val();
            $.getJSON("/File/ajaxRenameFile", { spath: currentFolder + "/" + path, foder: currentFolder, newfilename: newfile }, function (rvdata) {
                if (rvdata.status == true) {
                    ajaxRfiles(currentFolder);
                    $("#editFile").css("display", "none");
                }
                else {
                    alert(rvdata.msg);
                }
            });
        });

        $("#can").click(function () { $("#editFile").css("display", "none"); });
        $("#refresh-listfile").click(function () {
            var currentFolder = $(".skselected-folder").attr("rel");
            ajaxRfiles(currentFolder);
            return false;
        });

    });
</script>
<script type="text/javascript">
    $(document).ready(function () {

        var uploader = new qq.FileUploader({
            element: document.getElementById('file-uploader'),
            multiple: false,
            acceptFiles: "image/*",
            action: '@Url.Action("Upload", "Upload")',
            onComplete: function (id, fileName, responseJSON) {
                $("#Image").attr("value", fileName);
                $("#sphinherror").text("");
            }
        });
    });

</script>

<div class="cbread_crumb">
    <ul class="breadcrumb">
        <li><a class="glyphicons home" href="/Cpanel"><i></i>Control panel</a></li>
        <li class="divider"></li>
        <li><a href="/Articles/ManagerArticles">Bài viết chung</a></li>
        <li class="divider"></li>
        <li class="lastli">Cập nhật - @Model.Title</li>
    </ul>
</div>
<div class="content-module-heading cf">
    <div class="separator"></div>
    <div class="heading-buttons">
        <h3 class="glyphicons notes"><i></i>@Model.Title</h3>
        <div class="clearfix"></div>
    </div>
    <div class="separator"></div>

</div>
<div class="innerLR">

    @using (Html.BeginForm())
    {
        <div class="well" style="padding-bottom: 20px; margin: 0;">
            @Html.HiddenFor(m => m.ArticlesID)
            <p style="float: left;">
                <label class="label-text">Tiêu đề (*)</label>
                @Html.TextBoxFor(m => m.Title, new { @class = "span5" })
            </p>
            <p>@Html.ValidationMessageFor(m => m.Title, "", new { @style = "color:red;width:585px; float:left;" })</p>
            <div class="clr"></div>
            <p>
                <label class="label-text">Loại bài viết</label>
                @Html.DropDownListFor(m => m.ArticlesCateID, (IEnumerable<SelectListItem>)ViewBag.ArticlesCateListID)
            </p>
            <p style="width: 48%; float: left; margin-right: 30px;">
                <label class="label-text">Tóm tắt</label>
                @Html.TextAreaFor(m => m.Summary, new { @class = "span5", style = "height:100px;" })
                @Html.ValidationMessageFor(m => m.Summary, "", new { @style = "color:red;" })
            </p>
            <div class="clr"></div>
            <p style="float: left; width: 30%;">
                <label class="label-text">Hình ảnh</label>
                @Html.TextBoxFor(m => m.Images, new { id = "Image", @class = "round default-width-input", @readonly = "readonly" })
                <a id="browers-img" class="btn btn-primary" title="Chọn ảnh" href="#">Chọn ảnh</a>
            </p>

             <div class="clr"></div>
            <p>@Html.ValidationMessageFor(m => m.Images, "", new { @style = "color:red;" }) </p>


             <div class="clr"></div>
            <div id="file-uploader">
                <noscript>          
                                    <p>Please enable JavaScript to use file uploader.</p>
                                    <!-- or put a simple form for upload here -->
                                </noscript>
            </div>

            <p style="width: 100%; float: left; margin-top: 30px;">
               <label class="label-text">Nội dung</label>
                @Html.TextAreaFor(m => m.Content, new { id = "description" })
            </p>
           <p style="width: 100%; float: left;">
                <label class="label-text">Cho phép hiển thị</label>
                @Html.CheckBoxFor(m => m.Display)
            </p>
            <div class="clr"></div>
            <div class="form-actions">
                <button type="submit" class="btn btn-icon btn-primary glyphicons circle_ok"><i></i>Lưu</button>
            </div>
        </div>                
    }
</div>
<!-- end content-module-main -->
<div id="fancy" class="fancybox-overlay fancybox-overlay-fixed" style="width: auto; height: auto; display: none;">
    <div class="fancybox-wrap fancybox-desktop fancybox-type-image fancybox-opened" tabindex="-1" style="width: 1000px; height: auto; position: relative; top: 50px; margin: 0 auto; opacity: 1; overflow: visible;">
        <div class="fancybox-skin" style="padding: 15px; width: auto; height: auto;">
            <div class="fancybox-outer">
                <div class="fancybox-inner" style="overflow: visible; width: 268px; height: auto;">
                    <div id="filebrowser">
                        <div id="currenttiny" style="display: none"></div>


                        <div id="editFile" style="display: none;">
                            <label>FileName:</label>
                            <span class="edFileName"></span>
                            <br />
                            <label>New File Name:</label><b><input type="text" class="edNewFileName" /></b><span class="edExtention"></span><br />
                            <input type="button" id="edSave" value="Save" /><input type="button" id="can" value="Cancel" />
                        </div>

                        <div class="content-box" style="width: 100%">
                            <!-- Start Content Box -->
                            <div id="skyFileManger">
                                <div id="skFolder">
                                    <ul id="browser" class="filetree">
                                        <li><span class="folder" id="rootFolder" rel="Content">Content</span>
                                            <ul>
                                                @Html.Action("ReadContentFolder", "LayoutHelper")
                                            </ul>
                                        </li>
                                    </ul>
                                </div>
                                <div id="skFolderContent"></div>
                                 <div class="clr"></div>
                                <div class="skupload">
                                    <a href="#" style="display: none;" id="refresh-listfile">
                                        <img src="@Url.Content("~/Content/loading-icon.gif")" /></a>
                                    <div id="file-uploader1" class="ip" style="padding-left: 3px">
                                        <noscript>          
                                            <p>Please enable JavaScript to use file uploader.</p>
                                            <!-- or put a simple form for upload here -->
                                        </noscript>
                                    </div>
                                     <div class="clr"></div>
                                </div>
                            </div>
                        </div>


                    </div>
                </div>
            </div>
        </div>
        <a title="Close" class="fancybox-item fancybox-close" href="javascript:;"></a>

    </div>

</div>

